<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" type="image/x-icon" href="https://img61.ddimg.cn/upload_img/00555/touch/touch-icon-ipad.png">
    <link rel="stylesheet" href="./font/font2/iconfont.css">
    <link rel="stylesheet" href="./css/offer-2.css">
    <link rel="stylesheet" href="./css/swiper-bundle-2.css">
    <title>独家特供</title>
</head>
<style>

</style>

<body>
    <div class="header">
        <a href="./index-1.html"><i class="iconfont icon-xiaoyuhao"></i></a>
        <span>独家特供</span>
        <p></p>
    </div>
    <div class="search">
        <div class="search-box">
            <input type="text" placeholder="丹妈推荐：长江！长江！">
        </div>
    </div>
    <div class="swiper mySwiper">
        <div class="swiper-wrapper">
            <div data-hash="slide1" class="swiper-slide"><img src="./image/bi1-2.jpg" alt=""></div>
            <div data-hash="slide2" class="swiper-slide"><img src="./image/bi2-2.jpg" alt=""></div>
            <div data-hash="slide3" class="swiper-slide"><img src="./image/bi3-2.jpg" alt=""></div>
            <div data-hash="slide4" class="swiper-slide"><img src="./image/bi4-2.jpg" alt=""></div>
            <div data-hash="slide5" class="swiper-slide"><img src="./image/bi5-2.jpg" alt=""></div>
        </div>
        <!-- <div class="swiper-button-next"></div>
        <div class="swiper-button-prev"></div> -->
        <div class="swiper-pagination"></div>
    </div>
    <div class="navs-title">
        <img src="./image/t1-2.png" alt="">
    </div>
    <div class="navs-i1">
        <img src="./image/bi6-2.jpg" alt="">
    </div>
    <div class="navs-title">
        <img src="./image/t2-2.png" alt="">
    </div>
    <div class="content-block">
        <div class="items"  id="carousel">

        </div>
        
    </div>
    <div class="content-block">
        <div class="items" id="carousel1">

        </div>
    </div>
    <div class="navs-title">
        <img src="./image/t3-2.png" alt="">
    </div>
    <div class="content-block1">
        <div class="items1" id="carousel2">

        </div>
    </div>
    <div class="navs-title">
        <img src="./image/t4-2.png" alt="">
    </div>
    <div class="content-block1">
        <div class="items1" id="carousel3">
            
        </div>
    </div>
    <div class="navs-title">
        <img src="./image/bi7-2.jpg" alt="">
    </div>
    <div class="guess-like">
        <div class="like-title">
            <p>猜您喜欢</p>
        </div>
        <div class="more">
            <p>查看更多</p>
        </div>
    </div>
    <div class="guess-like">
        <div class="bottom">
            <div>
            <img src="./image/icon_smile-2.png" alt="">
            <p>到底了，再拉裤子都掉啦</p>
        </div>
        </div>
    </div>
    <div class="app-bottom">
        <img src="https://img60.ddimg.cn/upload_img/00705/yhj/tabbar_01-7.19.png" alt="">
        <img src="https://img63.ddimg.cn/upload_img/00658/feiyang11/2_fenlei.png" alt="">
        <img src="https://img60.ddimg.cn/upload_img/00658/feiyang11/333dangdu-1565345764.png" alt="">
        <img src="https://img61.ddimg.cn/upload_img/00658/feiyang11/4_wodezuji.png" alt="">
        <img src="https://img60.ddimg.cn/upload_img/00658/feiyang11/5_wodedingdan.png" alt="">
    </div>





</body>
<script>
    var carousel = document.querySelector('#carousel')
    fetch('https://z.dangdang.com/touchm/h5ajaxZ.php?action=mix_data&page_id=830248_52710111_830256_52872687&user_client=touch&deviceType=&udid=bca3a20681d945a34469981a82ac5d54&permanent_id=20240813195323061159417209067464662&client_version=1.0&app_id=touch&h5_server=1&ddcode=bb52514f383e75d7014d582ac45aed91').then(res => res.json()).then(res1 => {
        console.log(res1)
        // console.log(res1.ret[5].content.value)
        // 5
        for(var i=0; i<res1.ret[5].content.value.length; i++){
            carousel.innerHTML+=`
        <div>
            <img src="${res1.ret[5].content.value[i].img_url}" alt="">
            <p>${res1.ret[5].content.value[i].product_name}</p>
            <div>
                <span>￥</span>
                <span>${parseInt(res1.ret[5].content.value[i].sale_price)}.</span>
                <span class='float'>${((res1.ret[5].content.value[i].sale_price)%1)!==0?((res1.ret[5].content.value[i].sale_price)%1).toFixed(2)*100:'00'}</span>
                <span class="${res1.ret[5].content.value[i].product_tags.length>0?'label':'none'}">
                    ${res1.ret[5].content.value[i].product_tags.length>0?res1.ret[5].content.value[i].product_tags[0].name:''}
                </span>
            </div>
            <p class='${res1.ret[5].content.value[i].ebook_price==''?'none':'edition'}'>
                <span class='${res1.ret[5].content.value[i].ebook_price==''?'none':' '}'>电子书版</span>
                <span class='${res1.ret[5].content.value[i].ebook_price==''?'none':' '}'>￥${res1.ret[5].content.value[i].ebook_price==''?'':res1.ret[5].content.value[i].ebook_price}</span>
            </p>
        </div>
            `
        }

        // 6
        var carousel1 = document.querySelector('#carousel1')
        for(var i=0; i<res1.ret[6].content.value.length; i++){
            carousel1.innerHTML+=`
        <div>
            <img src="${res1.ret[6].content.value[i].img_url}" alt="">
            <p>${res1.ret[6].content.value[i].product_name}</p>
            <div>
                <span>￥</span>
                <span>${parseInt(res1.ret[6].content.value[i].sale_price)}.</span>
                <span class='float'>${((res1.ret[6].content.value[i].sale_price)%1)!==0?((res1.ret[6].content.value[i].sale_price)%1).toFixed(2)*100:'00'}</span>
                <span class="${res1.ret[6].content.value[i].product_tags.length>0?'label':'none'}">
                    ${res1.ret[6].content.value[i].product_tags.length>0?res1.ret[6].content.value[i].product_tags[0].name:''}
                </span>
            </div>
                <p class='${res1.ret[6].content.value[i].ebook_price==''?'none':'edition'}'>
                <span class='${res1.ret[6].content.value[i].ebook_price==''?'none':' '}'>电子书版</span>
                <span class='${res1.ret[6].content.value[i].ebook_price==''?'none':' '}'>￥${res1.ret[6].content.value[i].ebook_price==''?'':res1.ret[6].content.value[i].ebook_price}</span>
            </p>
        </div>
            `
        }

        // 8
        var carousel2 = document.querySelector('#carousel2')
        for(var i=0; i<res1.ret[8].content.value.length; i++){
            carousel2.innerHTML+=`
        <div>
            <img src="${res1.ret[8].content.value[i].img_url}" alt="">
            <p>${res1.ret[8].content.value[i].product_name}</p>
            <div>
                <span>￥</span>
                <span>${parseInt(res1.ret[8].content.value[i].sale_price)}.</span>
                <span class='float'>${((res1.ret[8].content.value[i].sale_price)%1)!==0?((res1.ret[8].content.value[i].sale_price)%1).toFixed(2)*100:'00'}</span>
                <span class="${res1.ret[8].content.value[i].product_tags.length>0?'label':'none'}">
                    ${res1.ret[8].content.value[i].product_tags.length>0?res1.ret[8].content.value[i].product_tags[0].name:''}
                </span>
            </div>
        </div>
            `
        }

        // 10
        var carousel3 = document.querySelector('#carousel3')
        for(var i=0; i<res1.ret[10].content.value.length; i++){
            carousel3.innerHTML+=`
        <div>
            <img src="${res1.ret[10].content.value[i].img_url}" alt="">
            <p>${res1.ret[10].content.value[i].product_name}</p>
            <div>
                <span>￥</span>
                <span>${parseInt(res1.ret[10].content.value[i].sale_price)}.</span>
                <span class='float'>${((res1.ret[10].content.value[i].sale_price)%1)!==0?((res1.ret[10].content.value[i].sale_price)%1).toFixed(2)*100:'00'}</span>
                <span class="${res1.ret[10].content.value[i].product_tags.length>0?'label':'none'}">
                    ${res1.ret[10].content.value[i].product_tags.length>0?res1.ret[10].content.value[i].product_tags[0].name:''}
                </span>
            </div>
        </div>
            `
        }







        })

</script>







<script src="./js/reset-2.js"></script>
<!-- Swiper JS -->
<script src="./js/swiper-bundle-2.js"></script>

<!-- <script>
    var gallery = mui('.mui-slider');
    gallery.slider({
        interval: 0//自动轮播周期，若为0则不自动播放，默认为0；
    });
    mui('.mui-scroll-wrapper').scroll({
        scrollY: false, //是否竖向滚动
        scrollX: true, //是否横向滚动
        startX: 0, //初始化时滚动至x
        startY: 0, //初始化时滚动至y
        indicators: false, //是否显示滚动条
        deceleration: 0.0006, //阻尼系数,系数越小滑动越灵敏 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006
        bounce: false //是否启用回弹
    })
</script> -->


<!-- Initialize Swiper -->
<script>
    var swiper = new Swiper(".mySwiper", {
        autoplay: true,//等同于以下设置
        loop:true,
        autoplay: {
            delay: 3000,
            stopOnLastSlide: false,
            disableOnInteraction: true,
        },  
        spaceBetween: 0,
        hashNavigation: {
            watchState: true,
        },
        pagination: {
            el: ".swiper-pagination",
            clickable: true,
        },
        navigation: {
            nextEl: ".swiper-button-next",
            prevEl: ".swiper-button-prev",
        },
    });
</script>
</html>